<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>批量导入学生信息</title>
    <link rel="stylesheet" th:href="@{/layuiadmin/layui/css/layui.css}" media="all">
</head>
<body>
    <div class="layui-form" lay-filter="layuiadmin-form-admin" id="layuiadmin-form-admin" style="padding: 20px 30px 0 0;">

        <div class="layui-form-item" >
            <label class="layui-form-label" >用户信息 <span style="color: red">*</span></label>
            <div class="layui-input-inline">
                <input type="file" name="excel" id="excel" accept="application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"/>
                <p style="color:red">请严格依照模板上传文件</p>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button  class="layui-btn" lay-submit=""  lay-filter="bulkImport">立即添加</button>
                <button  type="reset" id="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </div>

    <script th:src="@{/layuiadmin/layui/layui.js}"></script>
    <script>

        layui.use(['form','jquery'], function () {
            var form = layui.form;
            var $ = layui.jquery;

            form.on('submit(bulkImport)',function (data) {
                var file=$("#excel")[0].files[0]
                if (file) {
                    var formData = new FormData();
                    formData.append("excel", file);
                    $.ajax({
                        url: '/commonUser/bulkImport',
                        type:'post',
                        cache:'false',
                        data:formData,
                        //这个参数是jquery特有的，不进行序列化，因为我们不是json格式的字符串，而是要传文件
                        processData: false,
                        //注意这里一定要设置contentType:false，不然会默认为传的是字符串，这样文件就传不过去了
                        contentType: false,
                        success: function (data) {
                            if (data.success) {
                                layer.msg(data.message);
                                layer.alert(data.message, function () {
                                    layer.msg(data.message);
                                    window.parent.location.reload();//刷新父页面
                                    // parent.layer.close(index);//关闭弹出层
                                });
                            } else {
                                layer.msg(data.message);
                            }
                        }
                    });
                }
                else{
                    layer.msg("未选中文件！");
                }

                return false;
            })

            //重置
            $("#reset").click(function () {
                $("input").val("");
            })

        });


    </script>
</body>
</html>